<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
<title>WE COPYRIGHT CHAIN FOUNDATION LTD.-Copyright show</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="keywords" content="" />
<link rel="icon" type="image/x-icon" th:href="@{~/images/favicon.ico}">
<link href="../static/css/bootstrap.css" th:href="@{~/css/bootstrap.css}" rel='stylesheet' type='text/css' />
<link href="../static/css/font-awesome.css" th:href="@{~/css/font-awesome.css}" rel="stylesheet"> 
<link rel="stylesheet" href="../static/css/slider.css" th:href="@{~/css/slider.css}">
<link href="../static/css/style.css" th:href="@{~/css/style.css}" rel='stylesheet' type='text/css' />	
<link rel="stylesheet" type="text/css" href="../static/css/mislider.css" th:href="@{~/css/mislider.css}"/>
<link rel="stylesheet" type="text/css" href="../static/css/mislider-skin-cameo.css" th:href="@{~/css/mislider-skin-cameo.css}"/>
<link rel="stylesheet" type="text/css" href="../static/css/login.css" th:href="@{~/css/login.css}"/>
<link th:href="@{/css/nav.css}" rel='stylesheet' type='text/css' />
<link rel="stylesheet" type="text/css" th:href="@{/css/page.css}"/>
<style type="text/css">
	 #m_nav_list li a{color: #ffffff;}
</style>
</head>
	<body>
	<div id="" style="position: relative;">


	<div class="top_banner" id="topl">
		<!-- SVG Arrows -->

		<div class="top_header_agile_info_w3ls">
		  <nav class="navbar navbar-default">
				<div class="navbar-header navbar-left">
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
						<span class="sr-only">copyright</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
					<h1>
						<a class="navbar-brand" href="company_en.html" th:href="@{~/company_en.html}">
							<!--<span>w</span>shanghai-->
							<img  style="margin-top: 4px" src="../static/images/logoll.png" th:src="@{~/images/logoll.png}"/>
						</a></h1>
				</div>
				<!-- Collect the nav links, forms, and other content for toggling -->
					<div class="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">

					<div id="m_nav_container" class="m_nav wthree_bg">
						<nav class="menu menu--sebastian">
							<ul id="m_nav_list" class="m_nav menu__list" style="color: #FFFFff" style="margin-top: 8px">
								<li class="m_nav_item" id="m_nav_item_1"> <a href="home_en.html" th:href="@{~/home_en}" class="link link--kumya"><span >Home</span></a></li>
								<li class="m_nav_item" id="moble_nav_item_3"> <a href="affirm_en.html" th:href="@{~/affirm_en.html}" class="link link--kumya"><span >CopyrightAffirm</span></a></li>
								<li class="m_nav_item active" id="moble_nav_item_4"> <a href="javascript:;" class="link link--kumya"><span >Copyright</span></a></li>
							    <li class="m_nav_item dropdown" id="moble_nav_item_4"> <a href="consulting_en.html" th:href="@{~/consulting_en.html}" class="link link--kumya"><span >Consulting</span></a></li>
							    <li class="m_nav_item dropdown" id="moble_nav_item_2"><a href="case_en.html" th:href="@{~/case_en.html}" class="link link--kumya"><span >Cases</span></a></li>
								<li class="m_nav_item" id="moble_nav_item_2" th:if="${session.user} != null"><a href="blockchain_show_en.html" th:href="@{~/chain/statistics_en.html}" class="link link--kumya"><span>BlockDisplay</span></a></li>
								<li class="m_nav_item" id="m_nav_item_1"> <a th:href="@{~/company_en}" class="link link--kumya"><span >ABOUT US</span></a></li>
								<li class="m_nav_item " style="float: right;margin-top: 5px;">
									<select name="selectDropDown"
											style="border:1px solid transparent;appearance:none;-moz-appearance:none;-webkit-appearance:none; padding:0px 20px;background:transparent;font-size: 14px;line-height: 34px; color: #ffffff;">
										<option style="background:#000000;" value="0"><span></span>English</option>
										<option style="background:#000000;" value="1"><span></span>中文 (简体)</option>
									</select>
								</li>
								<li th:if="${session.user} != null" class="m_nav_item dropdown" id="moble_nav_item_6">
								  <span class="link link--kumya"><span class="dropbtn"
																	   th:text="${session.user.userName}==null?${#strings.length(session.user.userNickname)>5?#strings.substring(session.user.userNickname,0,5)+'...':session.user.userNickname}:${#strings.length(session.user.userName)>5?#strings.substring(session.user.userName,0,5)+'...':session.user.userName}">登录/注册</span><i
										  class="menu-ico"></i></span>
									<div class="dropdown-content" style="z-index: 666">
										    <a th:href="@{~/user/userInfo_en.html}">UserCentered</a>
										    <a th:href="@{~/auth/longOut_en}">Sign Out</a>
										 
									</div>
								</li>
								<li th:unless="${session.user} != null" class="m_nav_item" id="moble_nav_item_6">
									<a  href="login_en.html" class="link link--kumya" th:href="@{/auth/loginPage_en.html}">
										<span>Login/Register</span>
									</a>
								</li>
							</ul>
						</nav>
					</div>

					</nav>
				</div>
		</div>
      <!--welcome-->
 </div>
	</div>

<style type="text/css">
	 .formd{padding-top: 120px; min-height: 892px;}
     .formd ul li{ background: #fff;min-height:40px;position: relative; float: left; padding:0 10px; font-weight: 600; color: #666; font-size: 14px;}
     .olititle{/* color: #0083C7 !important;  */font-size: 16px !important;}
     .formdo{background: #fff; min-height: 100px;padding: 30px 20px;margin-bottom: 20px;}
     .formdo img{width: 100%; min-height: 210px; border: 1px solid #f0f0f0; max-height: 210px;}
     .formdo div{padding: 0; height: 210px;}
     .formdo>div{margin-top: 20px;}
     .formdo h5{padding:5px 10px 0 10px  ; font-size: 16px; color: #F39C12;}
     .formdo p{padding:5px 5px 0 10px; font-size: 14px;}
     .formdo p:last-of-type{color: #0083C7;}
     .active_er{padding:5px 10px; background:#0C0C0C; color:#ffffff; border-radius: 5px;}
</style>
<div class="formd">

   <div class="container formdo">
   		<form id="ec" th:action="@{~/copyright_en.html}" method="get">
   			<input type="hidden"  name="type"  th:value="${type}" />
		 	<input type="hidden"  name="area"  th:value="${area}" />
   		</form>
   		<ul>
   			<li class="olititle">Category：</li>
   			<li>
   				<a href="javascript:;" id="textshdow"  th:class="${type == 'all' ? 'active_er category':'category'}">All</a>
   				<input type="hidden"  value="all" />
   			</li>
   			<li th:each="item : ${worksType}" >
   				<a href="javascript:;"  id="textshdow" th:class="${item.name == type ? 'active_er category':'category'}" th:text="${item.name}">动漫IP</a>
   				<input type="hidden"  th:value="${item.name}" />
   			</li>
   		</ul>
   		<ul>
   			<li class="olititle" style="margin-left: 31px;">Region：</li>
   			<li> 
   				<a href="javascript:;"id="textshdow" th:class="${area == 0 ? 'active_er area':'area'}">All</a>
   				<input type="hidden"  value="0" />
   			</li>
   			<li>
   				<a href="javascript:;" id="textshdow" th:class="${area == 1 ? 'active_er area':'area'}">国内</a>
   				<input type="hidden"  value="1" />
   			</li>
   			<li>
   				<a href="javascript:;"id="textshdow" th:class="${area == 2 ? 'active_er area':'area'}">国外</a>
   				<input type="hidden"  value="2" />
   			</li>
   		</ul>
   </div>

	<div class="container formdo">
		<div class="col-lg-3" th:each="item : ${list.list}">
			<div class="col-lg-6 moveRight">
				<a th:href="@{~/copyright_en/{worksId}(worksId=${item.works_id})}" target="_blank">
					<img th:src="${(#strings.endsWith(item.works_url,'.jpg') || #strings.endsWith(item.works_url,'.png') || #strings.endsWith(item.works_url,'.jpeg'))}?${item.works_url}+'.jpg':@{~/images/copyright_510x630.jpg}"/>
				</a>
			</div>
			<div class="col-lg-6 moveLeft">
				<a th:href="@{~/copyright_en/{worksId}(worksId=${item.works_id})}" target="_blank">
					<h5 th:text="${item.works_name}">九真九阳</h5>
				</a>
				<p th:text="|author：${item.author}|">冲击境界失败的苏方，</p>
				<p th:text="|category：${item.type}|">授权方向： 游戏授权 影视授权 漫画授权</p>
			</div>
		</div>
   	<div style="clear: both; height: auto;"></div>
   	<div class="col-lg-12" style="height: auto;">
   		<ul class="page" maxshowpageitem="5" pagelistcount="12"  id="page" style="/* float: inline-end; */ float: right;"></ul>
   	</div>
   </div> 



 

<div style="height: 30px; clear: both;">
		
	</div>
</div>

	<div class="footer">
		<div class="agileinfo_footer_bottom1">
			<div class="container">
				<p class="col-lg-3" style="display: inline-block; letter-spacing:0px;line-height:34px;"><a th:href="@{~/company_en.html}">About Us</a>&nbsp; &nbsp;<a href="javascript:;">Legal Agreements</a></p>

				<p class="col-lg-9  text-right" style="display: inline-block;letter-spacing:0px;" > &copy;2017 Copyright by WE COPYRIGHT CHAIN FOUNDATION LTD. <img th:src="@{~/images/pic1.gif}"  style="margin-top:5px;"/> </p>
				<div class="clearfix"> </div>
			</div>
		</div>
	</div>
		


<script type="text/javascript" src="..static/js/jquery-2.1.4.min.js" th:src="@{~/js/jquery-2.1.4.min.js}"></script>
<script type="text/javascript" src="..static/js/sleekslider.js" th:src="@{~/js/sleekslider.js}"></script>
<script type="text/javascript" src="..static/js/app.js" th:src="@{~/js/app.js}"></script>
<script src="..static/js/bootstrap.js" th:src="@{~/js/bootstrap.js}"></script>
<script src="..static/js/wow.min.js" type="text/javascript" charset="utf-8" th:src="@{~/js/wow.min.js}"></script>
<script th:src="@{/js/page_en.js}"></script>
<!-- //for bootstrap working -->
<script th:inline="javascript">
/*<![CDATA[*/
    var count = /*[[${list.total}]]*/ 0;
    var current = /*[[${list.pageNum}]]*/ 1;
    var type = /*[[${type}]]*/ ;
    var area = /*[[${area}]]*/ 0;
/*]]>*/
</script>
<script type="text/javascript" >
	function tt(dd){
	    //alert(dd);
	}
    var GG = {
        "kk":function(mm){
        	var type = getQueryString("type");
        	var area = getQueryString("area");
        	if(type != null && area == null){
        		window.location.href="copyright_info_en.html?type="+type+"&pageNum="+mm;
        	}else if(type != null && area != null){
        		window.location.href="copyright_info_en.html?type="+type+"&area="+area+"&pageNum="+mm;
        	}else if(type == null && area != null){
        		window.location.href="copyright_info_en.html?area="+area+"&pageNum="+mm;
        	}else{
        		window.location.href="copyright_info_en.html?pageNum="+mm;
        	}
        }
    }
    $("#page").initPage(count,current,GG.kk);
    //获取URL参数
    function getQueryString(name) {   
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");   
        var r = window.location.search.substr(1).match(reg);   
        if (r != null) return decodeURI(r[2]); return null;   
  	} 
    
    	$(".category").on("click",function() {
    		if(!$(this).hasClass("active_er")){
	    		var type = $(this).next().val();
	    		$("input[name='type']").val(type);
	    		document.forms.ec.submit();
    		}
    	});
    	$(".area").on("click",function() {
    		if(!$(this).hasClass("active_er")){
    			var area = $(this).next().val();
        		$("input[name='area']").val(area);
        		document.forms.ec.submit();
    		}
    	});
    window.onload = function ()
    {
        var sel = document.getElementsByName('selectDropDown')[0];
        sel.onchange = function ()
        {
            // var options=$("#test option:selected");
            var val = this.value;
            switch (val)
            {
                case "0":
                    break;
                case "1":
                    window.location.href='/copyright_zn.html';
                    break;
                default:
                    break;
            }
        }
    }
</script>
</body>
</html>